<template>
    <el-dialog
      v-model="isShow"
      :title="title"
      width="640px"
      :close-on-click-modal="false"
      @close="handleClose"
    >
          <el-form class="dialog-form">
            <el-form-item>
              <el-input v-model="form.remark" type="textarea" placeholder="请输入,格式value:label,value:label" :rows="3" />
            </el-form-item>
          </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="isShow = false">取消</el-button>
          <el-button type="primary" :loading="btnLoading" @click="toSubmit">确定</el-button>
        </span>
      </template>
  
    </el-dialog>
  </template>
  
  <script setup lang="ts">
  import {ElMessage, ElMessageBox} from 'element-plus'
  import { ref, reactive, inject, getCurrentInstance, ComponentInternalInstance } from 'vue';
  const {proxy} = getCurrentInstance() as ComponentInternalInstance;
  let optionData:any = inject('optionData'); 
  const emit = defineEmits(['confirm']);
  let isShow = ref(false);
  let btnLoading = ref(false);
  let title = ref('批量生成字典');
  let row:any = reactive({});
  let form = reactive({
    remark: '', // value|label,value|label
  })
  const init = (data:any) => {
    console.log(data);
    row = data;
    // form.shopId = data.shopId;
    isShow.value = true;
  };
  const handleClose = () => {
    form.remark = '';
  };
  const toSubmit = () => {
    let arr1 = form.remark.split(',');
    let arr2 = [];
    arr1.forEach((item,index) => {
      let arr = item.split(':');
      let params = {
        dictType: row.dictType,
        dictId: row.dictId,
        value: arr[0],
        label: arr[1],
        sortOrder: index,
        remarks: form.remark,
      };
      arr2.push(params);
    });
    let arrPromise = arr2.map(item => {
      return new Promise(async (resolve, reject) => {
        proxy.$request('post', '/admin/dict/item', item, (data,msg) => {
          resolve(data);
        });
      })
    });
    btnLoading.value = true;
    Promise.all(arrPromise).then(res => {
      emit('confirm');
      btnLoading.value = false;
      isShow.value = false;
    }) 
    
  
  }
  
  
  defineExpose({
    init,
  })
  </script>
  
  <style>
  
  </style>